<template>
	<view class="withdrawlist">
		
		<view class="top1">
			<!-- <uni-icons type="arrowleft" size="24" class="left" color="#fff" @click="back()" /> -->
			<view class="sum" @tap="_router('../earnings')">
				<view class="number">{{ revenue }}</view>
				<view class="text">
					总收益(元)<image src="/static/img/right.png" />
				</view>
			</view>
			<view class="detail">
				<view class="arrange">
					<view class="number">{{ deposit }}</view>
					<view class="text">可提现金额(元)</view>
				</view>
				<view class="arrange">
					<view class="number">{{ participation }}</view>
					<view class="text">历史分红金额(元)</view>
				</view>
			</view>
			<view class="withdraw" v-if="isshow" @click="_router('./withdraw')">提现</view>
		</view>
		<view class="top">
			累计提现金额：
			<text>{{totalAmount}}元</text>
		</view>
		<view class="ul" v-show="initData.length!==0">
			<view class="li" v-for="(item, index) in initData" :key="index">
				<view class="order">订单编号：{{item.withdrawSn}}</view>
				<view class="time">{{item.createdTime}}</view>
				<view class="money">-{{item.amount}}</view>
			</view>
		</view>
		<view v-show="initData.length==0" class="notavailable">
			<image src="../../../static/img/notavailable.png" mode="widthFix"></image>
			<view class="nottext">暂时没有数据</view>
		</view>
	</view>
</template>

<script>
	import withdraw from '../../../servers/agent/withdraw/withdraw.js';	
	import index from '../../../servers/agent/index.js'
export default {
	data() {
		return {
			initData:[],
			totalAmount:'',
			revenue: '0.00',
			deposit: '0.00',
		
			participation:'0.00',
			isshow:true
		};
	},
	mounted() {
		this._revenue();
		this.checkAgent();
		
		uni.showLoading({
		title: '数据加载中',
				mask:true
			});
		withdraw.drawlist()
			.then(res => {
				if(res.code==200){
					this.initData = res.data.record.records;
					this.totalAmount=res.data.totalAmount;
				}else{
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
				}
				
				 uni.hideLoading();
			})
			.catch(err => {
				console.log(new Error('请检查网络后重试'));
			});	
	},
	methods: {
		_revenue() {
			uni.showLoading({
				title:'数据加载中'
			})
			index.initData().then(res => {
				// console.log(res.data)
				if(res.code==200){
					uni.hideLoading();
					this.revenue=res.data.totalRevenue;
					this.deposit=res.data.avaAmount;
					this.participation=res.data.totalBonusRevenue
					
					
				}else{
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
				}
					uni.hideLoading()
					
				})
				.catch(err => {
					console.log(new Error('请检查网络后重试'));
				});
		},
		checkAgent(){
			withdraw.checkAgent().then(res => {
				if(res.code==200){
					if(res.data==0){
						this.isshow=false;
						this.revenue='***'
						this.deposit='***'
						this.participation='***'
					}
				}else{
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
				}
					
					
				})
				.catch(err => {
					console.log(new Error('请检查网络后重试'));
				});
		},
		_router(router) {
			uni.navigateTo({
			    url: router
			});
		},
	}
};
</script>

<style lang="less" scoped>
.withdrawlist {
	.top1 {
		position: relative;
		background: linear-gradient(80deg, #ff084e, #fa5d7e);
		color: #fff;
		text-align: center;
		padding-bottom: 37rpx;
		.left{
			position: absolute;
			top: 40rpx;
			left: 0;
			width: 40px;
			height: 40px;
			line-height: 40px;
		}
		.sum {
			padding: 36rpx 0;
			width: fit-content;
			margin: 0 auto;
			.number {
				font-size: 60rpx;
			}
			.text {
				margin-top: 30rpx;
				font-size: 32rpx;
				image {
					position: relative;
					top: 2rpx;
					left: 15rpx;
					width: 22rpx;
					height: 26rpx;
					margin-right: 26rpx;
				}
			}
		}
		.detail {
			display: flex;
			width: 100%;
			padding-bottom: 47rpx;
			.arrange {
				flex: 1;
				.number {
					font-size: 42rpx;
				}
				.text {
					font-size: 26rpx;
					margin: 27rpx 0 0;
				}
			}
		}
		.withdraw {
			font-size: 34rpx;
			background: #fff;
			color: #f70225;
			width: 237rpx;
			height: 84rpx;
			border-radius: 42rpx;
			line-height: 84rpx;
			margin: 27rpx auto 0;
		}
	}
	
	
	.top {
		// position: fixed;
		// top: 0;
		// width: 100%;
		font-size: 30rpx;
		background: #ffffff;
		padding: 0 20rpx;
		box-sizing: border-box;
		line-height: 89rpx;
		box-shadow: 5rpx 0px 20rpx #c5c5c5;
		text {
			font-size: 36rpx;
			color: #f70225;
		}
	}
	.ul {
		background: #ffffff;
		padding: 89rpx 20rpx 0;
		.li {
			position: relative;
			padding: 51rpx 0;
			border-bottom: 1px solid #e1e1e1;
			.order {
				font-size: 28rpx;
			}
			.time {
				font-size: 26rpx;
				color: #999999;
			}
			.money {
				position: absolute;
				right: 0;
				top: 60rpx;
				font-size: 36rpx;
				color: #f70225;
			}
		}
		.li:nth-last-child(1) {
			border-bottom: none;
		}
	}
}
</style>
